import React from "react";
const EmailAuth = () => {
    // 返回
    const back = () => {
        React.navigate(-1)
    }
    // 发送验证码
    let [message,setMessage] = React.useState("发送验证码")
    let [flag,setFlag] = React.useState(false)
    const sendCode = async () => {
        if(flag){
            return false
        }
        setFlag(true)
        setMessage("正在发送")
        // 发送请求
        let result = await React.HTTP.post("/business/emailAuth",{busid:React.Business.id})
        if(result.code == 1){
            let countdown = 60
            setMessage(`${countdown}`)
            let timer:any = null
            timer = setInterval(()=>{
                --countdown
                setMessage(`${countdown}`)
                if(countdown <= 0){
                    setFlag(false)
                    clearInterval(timer)
                    setMessage(`重新发送验证码`)
                }
            },1000)
        }else{
            React.error(result.msg)
            return false
        }
    }
    const [formData,setFormData] = React.useState({
        email:React.Business.email??""
    })
    const onFinish = async (values:any) => { 
        values.busid = React.Business.id
        delete values.email
        let result = await React.HTTP.post("/business/email",values)
        if(result.code == 1){
            React.success(result.msg,()=>{
                // 重新设置cookie
                React.Cookie.save("business",result.data)
                React.navigate(-1)
            })
            return false
        }else{
            React.error(result.msg)
            return false
        }
    }
    return (
        <>
            <React.UI.NavBar onBack={back}>邮箱认证</React.UI.NavBar>
            <React.UI.Form
                layout='horizontal'
                onFinish={onFinish}
                initialValues={formData}
                footer={
                    <React.UI.Button block type='submit' color='primary' size='large'>
                        提交
                    </React.UI.Button>
                }
            >
                <React.UI.Form.Header>邮箱认证</React.UI.Form.Header>
                <React.UI.Form.Item
                    name='email'
                    label='邮箱'
                >
                    <React.UI.Input placeholder='请输入邮箱' readOnly  />
                </React.UI.Form.Item>
                    <React.UI.Form.Item
                        label='短信验证码'
                        name="code"
                        extra={
                            <div onClick={sendCode} style={{width:117,textAlign:"center"}}>
                                <a>{message}</a>
                            </div>
                        }
                    >
                        <React.UI.Input placeholder='请输入验证码' clearable />
                    </React.UI.Form.Item>
            </React.UI.Form></>
    )
}

export default EmailAuth